import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import gsap from 'gsap'
import ScrollTrigger from 'gsap/ScrollTrigger'
import 'animate.css'
import Toast from './plugins/toast'
import Pagination from '@/components/common/Pagination.vue'
import EmptyState from '@/components/common/EmptyState.vue'
import EmojiPicker from '@/components/common/EmojiPicker.vue'
import ColorPicker from '@/components/common/ColorPicker.vue'
import Dialog from '@/components/common/Dialog.vue'
import ClickOutside from '@/directives/clickOutside'
import loading from './directives/loading'
import 'highlight.js/styles/atom-one-dark.css'
import { animateOnScroll } from './directives/animate'
import ImagePreview from '@/components/common/ImagePreview.vue'
import Drawer from '@/components/common/Drawer.vue'
import Tooltip from '@/components/common/Tooltip.vue'

// 为了支持 HMR
if (import.meta.hot) {
  import.meta.hot.accept()
}

gsap.registerPlugin(ScrollTrigger)

Vue.config.productionTip = false

Vue.use(Toast)
// 全局注册组件
Vue.component('mj-pagination', Pagination)
Vue.component('mj-empty', EmptyState)
Vue.component('mj-dialog', Dialog)
Vue.component('mj-emoji', EmojiPicker)
Vue.component('mj-color-picker', ColorPicker)
Vue.component('mj-image-preview', ImagePreview)
Vue.component('mj-drawer', Drawer)
Vue.component('mj-tooltip', Tooltip)
Vue.directive('click-outside', ClickOutside)
Vue.directive('animate-on-scroll', animateOnScroll)
Vue.directive('loading', loading)
  

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app') 